<!DOCTYPE HTML>

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">
<head>
<title>Welcome to Pwnography!</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css"
	href="../../../../css/bootstrap.min.css"
	th:href="@{/css/bootstrap.min.css}" />
<link rel="stylesheet" type="text/css"
	href="../../../../css/bootstrap-responsive.min.css"
	th:href="@{/css/bootstrap-responsive.min.css}" />
<!-- DataTable CSS -->
<link rel="stylesheet" type="text/css"
	href="../../css/datatable-bootstrap.css"
	th:href="@{/css/datatable-bootstrap.css}" />

<!-- This style is needed for top navigation bar. It needs some space. Otherwise it would cover body. -->
<style type="text/css">
body {
	padding-top: 60px;
	padding-bottom: 40px;
}

.sidebar-nav {
	padding: 9px 0;
}
</style>
</head>

<body>
	<!-- TOP MENU -->
	<div th:substituteby="template :: top-menu"></div>
	<!-- /TOP MENU -->


	<!-- MAIN CONTAINER -->
	<div class="container-fluid">
		<div class="row-fluid">
			<div class="page-header">
				<h1>k-NN - Ocena jakości klasyfikacji</h1>
			</div>
		</div>

		<!-- MESSAGE BOXES -->
		<div class="row-fluid" th:include="template :: message-boxes"></div>
		<!-- /MESSAGE BOXES -->

		<div class="row-fluid">
			<!-- LEFT COLUMN -->
			<div class="span5">
				<form class="form-horizontal"
					th:action="@{/module/knn/assessmentquality}" th:object="${form}"
					method="POST">
					<fieldset>
						<div class="control-group"
							th:classappend="${#fields.hasErrors('columnName')}? 'error'">
							<label class="control-label" for="columnName">Atrybut <code>a</code></label>
							<div class="controls">
								<select class="span3" id="columnName" th:field="*{columnName}">
									<option th:each="col : ${floatColumnList}" th:value="${col}"
										th:text="${col}">BRAK</option>
								</select>
								<p th:if="${#fields.hasErrors('columnName')}">
									<span class="help-inline" th:errors="*{columnName}">ERROR</span>
								</p>
							</div>
						</div>

						<div class="control-group"
							th:classappend="${#fields.hasErrors('secondColumn')}? 'error'">
							<label class="control-label" for="secondColumn">Atrybut <code>b</code></label>
							<div class="controls">
								<select class="span3" id="secondColumn"
									th:field="*{secondColumn}">
									<option th:each="col : ${floatColumnList}" th:value="${col}"
										th:text="${col}">BRAK</option>
								</select>
								<p th:if="${#fields.hasErrors('secondColumn')}">
									<span class="help-inline" th:errors="*{secondColumn}">ERROR</span>
								</p>
							</div>
						</div>

						<div class="control-group"
							th:classappend="${#fields.hasErrors('classColumn')}? 'error'">
							<label class="control-label" for="classColumn">Klasa</label>
							<div class="controls">
								<select class="span3" id="classColumn" th:field="*{classColumn}">
									<option th:each="col : ${stringColumnList}" th:value="${col}"
										th:text="${col}">BRAK</option>
								</select>
								<p th:if="${#fields.hasErrors('classColumn')}">
									<span class="help-inline" th:errors="*{classColumn}">ERROR</span>
								</p>
							</div>
						</div>

						<div class="control-group"
							th:classappend="${#fields.hasErrors('metric')}? 'error'">
							<label class="control-label" for="metric">Metryka</label>
							<div class="controls">
								<select class="span3" id="metric" th:field="*{metric}">
									<option th:each="metric : ${metricList}" th:value="${metric}"
										th:text="${metric}">BRAK</option>
								</select>
								<p th:if="${#fields.hasErrors('metric')}">
									<span class="help-inline" th:errors="*{metric}">ERROR</span>
								</p>
							</div>
						</div>

						<div class="control-group"
							th:classappend="${#fields.hasErrors('kneighbors')}? 'error'">
							<label class="control-label" for="max">Liczba sąsiadów <code>k</code>
							</label>
							<div class="controls">
								<input type="text" class="input-xlarge" id="kneighbors"
									th:field="*{kneighbors}" />
								<p th:if="${#fields.hasErrors('kneighbors')}">
									<span class="help-inline" th:errors="*{kneighbors}">ERROR</span>
								</p>
							</div>
						</div>

						<div class="control-group"
							th:classappend="${#fields.hasErrors('saveToFile')}? 'error'">
							<label class="control-label" for="saveToFile">Zapisz nową
								kolumnę </label>
							<div class="controls">
								<label class="checkbox"> <input type="checkbox"
									id="saveToFile" th:field="*{saveToFile}" /> Tak, chcę dodać do
									aktualnego pliku nową kolumnę.
								</label>
								<p th:if="${#fields.hasErrors('saveToFile')}">
									<span class="help-inline" th:errors="*{saveToFile}">ERROR</span>
								</p>
							</div>
						</div>


						<div id="newColumnDiv" class="control-group"
							th:classappend="${#fields.hasErrors('resultColumnName')}? 'error'">
							<label class="control-label" for="resultColumnName">Nazwa</label>
							<div class="controls">
								<input type="text" class="input-xlarge" id="resultColumnName"
									th:field="*{resultColumnName}" />
								<p th:if="${#fields.hasErrors('resultColumnName')}">
									<span class="help-inline" th:errors="*{resultColumnName}">ERROR</span>
								</p>
								<p class="help-block">Nazwa, która zostanie przypisana do
									nowo utworzonej kolumny. Powinna być unikalna z uwagi na fakt,
									że może istnieć tylko jedna kolumna o danej nazwie. W
									przypadku, gdy nazwa nie jest unikalna wartości starej kolumny
									zostaną zastąpione. Pole nie jest wymagane.</p>
							</div>
						</div>

						<div class="form-actions">
							<button class="btn btn-success" type="submit">
								<i class="icon-ok icon-white"></i> Zatwierdź
							</button>
						</div>
					</fieldset>
				</form>
			</div>
			<!-- /LEFT COLUMN -->

			<!-- RIGHT COLUMN -->
			<div class="span7">
				<div class="well">
					<p>
						W trybie oceny jakości klasyfikacji określamy jedynie liczbę
						sąsiadów
						<code>k</code>
						i metrykę w ocenie odległości obiektów. Oceny jakości klasyfikacji
						dokonujemy metodą leave-one-out. Jako jakość klasyfikacji
						rozumiemy iloraz liczby poprawnie zaklasyfikowanych obiektów do
						liczby wszystkich obiektów w zbiorze wejściowym.
					</p>
				</div>
			</div>
			<!-- /RIGHT COLUMN -->
		</div>


	</div>
	<!-- /MAIN CONTAINER -->

	<!-- ======================================================== -->
	<!-- Scripts at bottom of page means faster loading times. -->
	<!-- Latest jQuery -->
	<script type="text/javascript"
		src="http://code.jquery.com/jquery-latest.min.js"></script>
	<!-- Bootstrap -->
	<script type="text/javascript" src="../../js/bootstrap.min.js"
		th:src="@{/js/bootstrap.min.js}"></script>
	<!-- DataTable -->
	<script type="text/javascript" src="../../js/jquery.dataTables.min.js"
		th:src="@{/js/jquery.dataTables.min.js}"></script>
	<script type="text/javascript" src="../../js/datatable-bootstrap.js"
		th:src="@{/js/datatable-bootstrap.js}"></script>
	<!-- Custom scripting -->
	<script type="text/javascript" src="../../js/custom/showhidediv.js"
		th:src="@{/js/custom/showhidediv.js}"></script>
</body>
</html>